<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>修改密码</title>
    <!--bootstrap-->
    <link href="/shop-app/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
    <script src="/shop-app/js/jquery.min.js"></script>
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script src="/shop-app/bootstrap/js/bootstrap.min.js"></script>
    <!-- 引入HttpUtil.js -->
    <script src="/shop-app/js/HttpUtil.js"></script>
    <!--引入存到浏览器的js文件-->
    <script src="/shop-app/js/UserCacheUtil.js"></script>
    <!-- 界面报icon找不到问题 -->
    <link rel="shortcut icon" href="#"/>
</head>
<body>

<blockquote class="text-primary">
    <p>修改密码 </p>
</blockquote>
<hr>

<form class="form-horizontal">
    <div class="form-group">
        <label class="col-sm-2 control-label">旧密码：</label>
        <div class="col-sm-10">
            <input type="text" class="form-control oldPassword" placeholder="name">
        </div>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label">新密码：</label>
        <div class="col-sm-10">
            <input type="password" class="form-control newPassword" placeholder="password">
        </div>
    </div>
    <div class="form-group">
        <label class="col-sm-2 control-label">确认密码：</label>
        <div class="col-sm-10">
            <input type="password" class="form-control checkPassword" placeholder="password">
        </div>
    </div>
    <hr>

    <div class="form-group">
        <div class="col-sm-offset-2 col-sm-10">
            <button type="button" onclick="saveData()" class="btn btn-default btn-danger btn" disabled="disabled">保存</button>
            <button type="reset" class="btn btn-default col-sm-offset-3 btn btn-warning btnReset"
                    style="width: 120px;display: none">重置
            </button>
        </div>

    </div>
</form>


<script>

    let checkPassword = $(".checkPassword");
    let newPassword = $(".newPassword");
    let oldPassword = $(".oldPassword");

    //检测两次密码
    $(function () {
        checkPassword.blur(function () {
            if (checkPassword.val() != newPassword.val()) {
                $(".btn").attr('disabled', true);
            } else {
                $(".btn").attr('disabled', false);
            }
        })
    });

    //保存新的密码
    function saveData() {
        let loginUser = getLocalStorage("loginUser");
        if (oldPassword.val() != loginUser.uPassword) {
            return alert("旧密码错误");
        }

        //1.发起ajax请求修改密码
        //2.更新本地存储
        //3。后端session也得更新

        let url = "/user/userInfoUpData";
        let params = {
            uId: loginUser.uId,
            uPassword:newPassword.val()
        };
        console.log(params);
        httpPostApi(url, params, function (data) {
            //请求成功
            // 将数据存到作用域中
            updataLocalStorage("loginUser",data);
            // 刷新页面 重新渲染数据
            $('.btnReset').click();
            location.reload();
        });

    }


</script>


</body>
</html>